{% extends "mall/base.html" %}

{% block title %}
    订单查询
{% endblock %}
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0">
{% block css %}
    <link rel="stylesheet" href="{{ STATIC_URL }}/static/css/mall/order.css?v={{ version_code }}">
    <script>
        window.onload = function () {
            document.querySelector('html').className = '';
            document.querySelectorAll('link[rel="stylesheet"]')[2]['href'] = '/static/lib/jqweui/jquery-weui-reset.css';
        }
    </script>
{% endblock %}

{% block header %}
{% endblock %}

{% block content %}
    <div class="order-manage list">
        <div data-ctrl-name="scrollview" data-ctrl-id="1495635737964-1" data-direction="vertical">
            <div class="top-fixed" style="left: 0px; top: 0px; width: 100%; ">

                <div class="nav-tab-top">
                    <ul>
                        {% if not order_type %}
                            <li onclick="location.href='/order'" class="cur" data-code="all">全部</li>
                        {% else %}
                            <li onclick="location.href='/order'" class="" data-code="all">全部</li>
                        {% endif %}
                        {% if order_type == 1 %}
                            <li onclick="location.href='/order?t=1'" class="cur">待支付</li>
                        {% else %}
                            <li onclick="location.href='/order?t=1'" class="">待支付</li>
                        {% endif %}

                        {% if order_type == 2 %}
                            <li onclick="location.href='/order?t=2'" class="cur">待发货</li>
                        {% else %}
                            <li onclick="location.href='/order?t=2'" class="">待发货</li>
                        {% endif %}

                        {% if order_type == 3 %}
                            <li onclick="location.href='/order?t=3'" class="cur">已发货</li>
                        {% else %}
                            <li onclick="location.href='/order?t=3'" class="">已发货</li>
                        {% endif %}

                        {% if order_type == 31 %}
                            <li onclick="location.href='/order?t=31'" class="cur">审核中</li>
                        {% else %}
                            <li onclick="location.href='/order?t=31'" class="">审核中</li>
                        {% endif %}

                        {% if order_type == 4 %}
                            <li onclick="location.href='/order?t=4'" class="cur">完成</li>
                        {% else %}
                            <li onclick="location.href='/order?t=4'" class="">完成</li>
                        {% endif %}
                    </ul>
                </div>
            </div>
            <div class="scroll-wrap" style="height: 500px;">
                <div class="scroll-content" style="transform: translate3d(0px, 0px, 0px);">
                    <section class="order-cont btomshow " data-code="all">
                        <div class=" order" id="order1">
                            {% if order_array|length == 0 %}
                                <div class="total-money" style="text-align: center">还没有此类订单哦～ <a href="/mall">赶快去<b
                                        style="color:blue">商城</b>选购商品吧</a></div>
                            {% endif %}
                            <ul class="order-list">
                                {% for foo in order_array %}
                                    <li class="order-detail" data-id="{{ foo.order_id }}">
                                        <div class="module status">
                                            <div class="seller-state  isbg">
                                                <div class="state-cont">
                                                    <div class="stat-cont-content">
                                                        <p style="padding: 5px 0 0 5px;">订单号：{{ foo.order_id }}
                                                            {% if foo.per_order_type ==1 %}
                                                                (普通订单)
                                                            {% elif foo.per_order_type ==2 %}
                                                                (礼品订单<span style="color:#ff5000;font-weight: bolder"> <i
                                                                    class="fa fa-gift" aria-hidden="true"></i> </span>)
                                                            {% endif %}
                                                        </p>
                                                        {% if foo.status == "待发货" or foo.staus == "已发货" or foo.status=="完成" %}
                                                            <p class="h" style="color:green;">{{ foo.status }}</p>
                                                        {% else %}
                                                            <p class="h">{{ foo.status }}</p>
                                                        {% endif %}
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        {% for item in foo.cart_goods %}
                                            <div class="goods-items">
                                                <div class="module item">
                                                    <div class="item-list o-t-item">
                                                        <div class="item-img"><p>
                                                            <img class="" src="{{ item['goods_img'] }}">
                                                        </p></div>
                                                        <div class="item-info">
                                                            <div class="item-info-content">
                                                                <div class="title">{{ item['goods_name'] }}</div>
                                                                <div>￥{{ item['goods_price'] }}</div>
                                                            </div>
                                                            <!--<p class="sku"></p>-->
                                                        </div>
                                                        <!--
                                                        <div class="item-pay">
                                                            <div class="item-pay-data"><p class="price">
                                                                ￥{{ item['goods_price'] }}</p>
                                                                <p class="nums"></p></div>
                                                        </div>
                                                    -->
                                                    </div>
                                                </div>
                                            </div>
                                        {% endfor %}
                                        <div class="module 38683201801234031 pay" id="pay6">
                                            <div class="o-total-price">
                                                <div class="cont"><span>共<b>{{ foo.goods_count }}</b>件商品</span> <span>合计:<b>￥{{ foo.price_total }}</b></span>
                                                    <span>(含运费<b>￥0.00</b>)</span>
                                                </div>
                                            </div>
                                        </div>
                                    </li>
                                {% endfor %}
                            </ul>
                        </div>
                        <div class="order-more"></div>
                    </section>
                </div>

            </div>
            <div class="force-repaint"
                 style="position: absolute; top: 0px; left: 0px; width: 0px; height: 0px; font-size: 0px; opacity: 1;"></div>
            <div class="bottom-fxied" style="left: 0px; bottom: 0px; width: 100%; display: block;"></div>
        </div>
    </div>
{% endblock %}

{% block footer %}
{% endblock %}

{% block js %}
    <script>
        $(function () {
            $(".order-detail").on("tap", function () {
                var orderId = $(this).data("id");
                location.href = '/order/detail/' + orderId + "?f=" + encodeURIComponent(location.href);
            })
            $(".item-info-content > .title").each(function (i, e) {
                e.title = e.innerHTML
                if (e.innerHTML.length > 20) {
                    e.innerHTML = e.innerHTML.slice(0, 19) + '...'
                }
            })
        })
    </script>
    <script src="/static/js/flexible.js"></script>
{% endblock %}